<template>
    <div class="city">
        <h2 class="title">{{cityname}}--城市页面</h2>

        <div id="main" style="width: 100%;height: 7.5rem;"></div>
    </div>
</template>

<script>
    import api from '../../api/index'

    export default {
        name: "City",
        props:['cityname'],
        async mounted() {
            const result = await api.getCity(this.cityname);
            if(result.data.codeid === 10000) {
                let cityData = result.data.retdata.subList.map(item => {
                    return {
                        name: item.city+'市',
                        value: item.confirm
                    }
                })

                this.$nextTick(() => {
                    this.$myChart.cityMap('main',this.cityname,cityData);
                });
            }
        }
    }
</script>

<style scoped lang="less">
    .city {
        padding: 0.2rem;
        .title {
            font-size: 16px;
            font-weight: bold;
        }
        #main {
            margin: 0 auto;
        }
    }
</style>
